<template>
	<view class="container-white" style="margin-top: 20upx;">
		<view class="options flex-box" @click="goExamList(1)">
			<image class="icon" src="../../static/icon/zsks.png"/>
			<view style="flex: 1;">
				<view style="color: #46B7FD;">正式考试</view>
			</view>
			<image class="icon-right" src="../../static/icon/icon-right.png"/>
		</view>
		<view class="options flex-box" @click="goExamList(2)">
			<image class="icon" src="../../static/icon/mnks.png"/>
			<view style="flex: 1;">
				<view style="color: #FFD056;">模拟考试</view>
			</view>
			<image class="icon-right" src="../../static/icon/icon-right.png"/>
		</view>
		<view class="options flex-box" @click="goExamList(3)">
			<image class="icon" src="../../static/icon/swks.png"/>
			<view style="flex: 1;">
				<view style="color: #E23B4F;">三违考试</view>
			</view>
			<image class="icon-right" src="../../static/icon/icon-right.png"/>
		</view>
	</view>
</template>

<script>
	export default {
		methods: {
			goExamList(val) {
				uni.navigateTo({
					url: 'exam-list?examType=' + val
				})
			}
		}
	}
</script>

<style>
	.options {
		flex: 1;
		max-height: 80upx;
		padding: 42upx;
		box-shadow: 0px 2px 10px 0px rgba(71, 73, 78, 0.2);
		margin: 0 24upx 30upx 24upx;
		font-size: 32upx;
	}

	.icon {
		width: 80upx;
		height: 80upx;
		margin-right: 30upx;
	}

	.icon-right {
		width: 18upx;
		height: 32upx;
	}
</style>
